<html>
<head>
<?php
require_once dirname(__FILE__) . '/data.inc.php';
$payment_id = $_GET["pay_pid"];
$data = getData($payment_id, 0);
$link = '?i=';
?>
<link href="ecommerce/payments/<?php echo $folder; ?>/assets/default.css" rel="stylesheet" type="text/css" />
<style>
.table td {
  height: 30px;
}
.left_td {
  font-weight: 600;
  text-align: right;
  padding: 2px 10px 2px 20px;
  margin-right: 20px;
  background-color: #d6e3e8;
  font-family: Trebuchet MS;
  font-size: 13px;
  width: 150px;
  height: 30px;
}
._text {
  width: 200px;
  height: 26px;
}
._select {
  width: 200px;
  height: 26px;
}
._eg {
  font-family: Trebuchet MS;
  font-size: 13px;
  text-align: left;
  font-weight: 600;
}
</style>
<script type="text/javascript" src="plugin/common/json/json2.js"></script>
<script src="plugin/common/jquery/jquery-1.6.2.min.js"></script>
<script>
function submit() {
  var w = document.getElementById('width');
  var h = document.getElementById('height');
  var i = document.getElementById('instruction');
  var r = document.getElementById('redirect_link');

  var obj = {
    id: '<?php echo $payment_id; ?>',
    width: w.value,
    height: h.value,
    instruction: i.value,
    redirect_link: ((r.options.length > 0) ? '<?php echo $link; ?>' + r.options[r.selectedIndex]._obj.id : '')
  };
  $.ajax({
    type: "POST",
    url: "ecommerce/payments/<?php echo $folder; ?>/server.php",
    data: "action=submit&q=" + JSON.stringify(obj),
    success: function(msg) {
      try {
        JSON.parse(msg);
        location.reload();
      } catch (ex) {
        alert( "Error: " + msg);
      }
    }
  });
}
//-->
</script>
</head>

<body >
<table width="100%" height="300px">
  <tr>
    <td class="left_td">Width</td>
    <td width="410px" ><input id="width" type="text" class="_text" style="margin-left: 4px;" value=<?php echo $data->width; ?>></input></td>
  </tr>
  <tr>
    <td class="left_td">Height</td>
    <td><input id="height" type="text" class="_text" style="margin-left: 4px;"  value=<?php echo $data->height; ?>></input></td>
  </tr>
  <tr>
    <td class="left_td">Instruction</td>
    <td>
      <textarea id="instruction" style="width: 490px; height: 150px; margin-left: 4px"><?php echo $data->payment->instruction; ?></textarea>
    </td>
    <td align="left">
<textarea  style="width: 490px; height: 150px;  border: solid 1px #ccc; background-color: #fff; resize: none;">Exsample

--------------------------------------

Transfer to [Bank Name] [Account Name]/[Account No.]

USE Order No. as Reference

--------------------------------------</textarea>
    </td>
  </tr>
  <tr>
    <td class="left_td">Return Page</td>
    <td>
      <select id="redirect_link" class="_select" style="margin-left: 4px;" ></select><span>
    </td>
  </tr>
  <tr>
    <td></td>
    <td>
      <span class="image_button" style="width: 75px;margin-left: 0;" onclick="submit();">
        <table>
          <tr>
            <td><img src="ecommerce/payments/<?php echo $folder; ?>/assets/save.png"></img></td>
            <td>Save</td>
          </tr>
        </table>
      </span>
    </td>
  </tr>
</table>
<script>
<!--
  if (document.addEventListener) {
    document.addEventListener('DOMContentLoaded', init, false);
  }
  window.onload = init;

  var r = document.getElementById('redirect_link');
   _menus = JSON.parse('<?php echo addslashes(json_encode($data->menus)); ?>');
  
  function init() {
    if (!document.getElementById || !document.createElement || !arguments || arguments.callee._loaded) {
      return;
    }
    arguments.callee._loaded = true;

    setParent(r, _menus, 0, '<?php echo $data->payment->redirect_link; ?>');
  }

  function setParent(select, node, level, link) {
    if (node.name == 'ROOT') {
      node.name = '-';
    }
    
    op = new Option(node.name);
    op._obj = node;
    op.style.paddingLeft = level * 5 + 'px';
    
    if (link == '<?php echo $link; ?>' + node.id) {
      op.selected = 'selected';
    }
    select.options[select.options.length] = op;
    
    for (var i = 0, il = node.c.length; i < il; i++) {
      setParent(select, node.c[i], level + 1, link);
    }
  }
</script>
</body>
</html>
